<template>
	<view class="beijingse">
		<!-- 查看物流单号 -->
		<u-popup :show="show" @close="close" :round="10" mode="center">
			<view class="mainpadding">
				<view class=" zhonghei textcenter" style="font-size: 40rpx;">物流单号</view>
				<view class="wulbox flexcenter margin_top5">
					<view class="">
						<view class="textcenter zhonghei sanshier">{{currentwl.express_name}}</view>
						<view class="textcenter zhonghei sanshier margin_top1"> {{currentwl.express_no}}</view>
					</view>
				</view>
				<view class="flexcenter  margin_top6">
					<view class="henhbtn flexcenter"
						@click="copy(currentwl.express_name+currentwl.express_no);show=false">点击复制</view>
				</view>
			</view>
		</u-popup>
		<view class="ffffff">
			<u-tabs :list="list1" lineColor="#FF9341" @click="changetab" :scrollable="false"  :current="currentindex"
				:activeStyle="{
				    color: '#000000',
				    fontWeight: 'bold',
				    transform: 'scale(1.05)'
				}" :inactiveStyle="{
				            color: '#666666',
							fontWeight: '500',
				            transform: 'scale(1)'
				        }" itemStyle="height: 44px;"></u-tabs>
		</view>
		<view class="mainpadding2">
			<view class="ffffff radius margin_top mainpadding" v-for="item in list.data" :key="item.id"
				@click="tzddxq(item.id)">
				<view class="flexbetween">
					<!-- 1=待支付,2=待发货,3=待收货,4=待评论,5=售后订单(已弃用),6=已完成,7=已取消,8=取消审核中 -->
					<view class="ershiba zhonghei">订单编号：{{item.order_no}}</view>
					<view class="ershiba xiaohong" v-if="item.state==1">待付款</view>
					<view class="ershiba xiaohong" v-if="item.state==2">待发货</view>
					<view class="ershiba xiaocheng" v-if="item.state==3">待收货</view>
					<view class="ershiba xiaolv" v-if="item.state==4">待评价</view>
					<view class="ershiba xiaolv" v-if="item.state==6">已完成</view>
					<view class="ershiba xiaohui" v-if="item.state==7">已取消</view>
				</view>
				<view class="xiahuaxian">
					<view class="flexbetween margin_top " v-for="ite in item.goods">
						<image class="sptp" :src="ite.image_text" mode=""></image>
						<view class="" style="width: 73%;">
							<view class="titletext xiaohei yhxk">{{ite.title}}</view>
							<view class="strongtext xiaohei margin_top2 yhxk">{{ite.difference}}</view>
							<view class="flexbetween margin_top2">
								<view class="titletext xiaocheng">{{ite.price}}</view>
								<view class="ershil xiaocheng">x{{ite.number}}</view>
							</view>
						</view>
					</view>
				</view>
				<view class="strongtext xiaohei margin_top textright">合计：
					<text class="xiaocheng titletext nofonweight">积分{{item.total_goods_price}}
					<text v-if="Number(item.freight_price)">+运费{{item.freight_price}}</text></text>
				</view>
			</view>
		</view>
		<moDal :message="modal" @modalSure="modalSure" @modalcancel="modalcancel"></moDal>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				list1: [{
						name: '全部',
						value: 0,
					},
					{
						name: '待付款',
						value: 1,
					}, 
					// {
					// 	name: '待发货',
					// 	value: 2,
					// }, {
					// 	name: '待收货',
					// 	value: 3,
					// }, 
					// {
					// 	name: '待评价',
					// 	value: 4,
					// },
					{
						name: '已完成',
						value: 6,
					}
				],
				tabsid: 0,
				page: 1,
				limit: 12,
				list: {
					data: []
				},
				show: false,
				currentwl: {},
				modal: {
					modalShow: false,
					title: "",
				},
				currentid: "",
				currentindex:0
			}
		},
		onLoad(option) {
			let _this = this
			if (option.i) {
				this.tabsid = option.i
				this.currentindex = option.i
			}
		},
		onShow() {
			this.init()
		},
		methods: {
			pingjia(id) {
				uni.navigateTo({
					url: "/pages_mypage/lijipj?id=" + id
				})
			},
			tuikuanxq(id){
				uni.navigateTo({
					url:"/pages_mypage/tuihuoxq?id="+id
				})
			},
			payment(item) {
				let data = {
					pay_price: item.pay_price,
					type: item.order_type, //1=大礼包,2=普通商品,3=积分商品
					order_id: item.id,
					freight_price:item.freight_price
				}
				uni.navigateTo({
					url: "/pages_homepage/zhifu?msg=" + encodeURIComponent(JSON.stringify(data))
				})
			},
			showModal(val) {
				this.modal.title = val
				this.modal.modalShow = true
			},
			modalSure() {
				if (this.modal.title == "是否确认取消订单？") {
					this.cancelorder(this.currentid)
				} else if (this.modal.title == "是否确认删除当前订单？") {
					this.deleteorder(this.currentid)
				} else if (this.modal.title == "是否确认收货？") {
					this.shouhuo(this.currentid)
				}else if (this.modal.title == "是否确认取消当前申请？") {
					this.cancelorderth(this.currentid)
				}else if (this.modal.title == "是否确认删除当前售后订单？") {
					this.deleteorderth(this.currentid)
				}
				this.modalcancel()
			},
			modalcancel() {
				this.modal.modalShow = false
			},
			cancelorderth(id) {
				httpRequest.request('/api/order/closeRefund', 'POST', {
					id: id,
				}).then(res => {
					httpRequest.toast(res.msg)
					if(res.code==1){
						this.init()
					}
				})
			},
			deleteorderth(id) {
				httpRequest.request('/api/order/delRefundOrder', 'POST', {
					id: id,
				}).then(res => {
					httpRequest.toast(res.msg)
					if(res.code==1){
						this.init()
					}
				})
			},
			cancelorder(id) {
				httpRequest.request('/api/order/cancelOrder', 'POST', {
					order_id: id,
				}).then(res => {
					httpRequest.toast(res.msg)
					this.init()
				})
			},
			shouhuo(id) {
				httpRequest.request('/api/order/confirmOrder', 'POST', {
					id: id,
				}).then(res => {
					httpRequest.toast(res.msg)
					this.init()
				})
			},
			deleteorder(id) {
				httpRequest.request('/api/order/delOrder', 'POST', {
					id: id,
				}).then(res => {
					httpRequest.toast(res.msg)
					this.init()
				})
			},
			changetab(e) {
				console.log(e,"0000");
				this.tabsid = e.value
				this.currentindex = e.index
				this.list.data = []
				this.init()
			},
			init(isPage, page) {
				let _this = this;
				let data = {
					page: page || 1,
					limit: _this.limit,
					state: this.tabsid,
					order_type: 2,
				}
				let url = '/api/order/getrecorderlist'
				httpRequest.request(url, 'GET', data, false, false, true).then(res => {
					if (res.code == 1) {
						let resList = res.data;
						let dataList = _this.list;
						if (isPage == true) {
							_this.list.data = dataList.data.concat(resList.data);
						} else {
							this.list = res.data
							_this.list.data = resList.data;
						}
					}
				})
			},
			onReachBottom() {
				let _this = this;
				let list = _this.list;
				let page = _this.page;
				if (list.last_page <= page) {
					return false;
				}
				page++;
				_this.page = page;
				_this.init(true, page);
			},
			// 跳转订单详情
			tzddxq(id) {
				uni.navigateTo({
					url: '/pages_mypage/fuwuddxq?id=' + id
				})
			},
			close() {
				this.show = false
				// console.log('close');
			}
		}
	}
</script>

<style lang="scss" scoped>
	.henhbtn {
		width: 420rpx;
		height: 81rpx;
		background-color: #FF9341;
		border-radius: 120rpx;
		font-size: 30rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
	}

	.wulbox {
		border-radius: 10rpx 10rpx 10rpx 10rpx;
		border: 1rpx solid #DFDFDF;
		width: 600rpx;
		height: 158rpx;
	}

	.xhbtn {
		width: 170rpx;
		height: 67rpx;
		font-size: 26rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		color: #FF9341;
		border-radius: 120rpx;
		border: 2rpx solid #FF9341;
	}

	.qxbtn {
		width: 170rpx;
		height: 67rpx;
		font-size: 26rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		color: #666666;
		border-radius: 120rpx;
		border: 2rpx solid #666666;
	}

	.sptp {
		width: 150rpx;
		height: 150rpx;
		min-width: 150rpx;
		border-radius: 14rpx 14rpx 14rpx 14rpx;
	}
</style>